<template>
  <div class="box">
    <header class="tou">
      <van-nav-bar title="详情页" left-arrow @click-left="$router.go(-1)" />
    </header>
    <main class="zhong">
      <img style="width: 100%" :src="obj.image" alt="" />
      <p>{{ obj.title }}</p>
      <p style="color: red">￥{{ obj.price }}</p>
    </main>
    <footer class="di">
      <van-action-bar>
        <van-action-bar-icon icon="chat-o" text="客服" dot />
        <van-action-bar-icon icon="cart-o" text="购物车" badge="5" />
        <van-action-bar-icon icon="shop-o" text="店铺" badge="12" />
        <van-action-bar-button type="warning" text="加入购物车" @click="addCart"/>
        <van-action-bar-button type="danger" text="立即购买" />
      </van-action-bar>
    </footer>
  </div>
</template>
<script setup>
import request from "@/utils/request";
import { onMounted, ref } from "vue";
import { useRouter, useRoute } from "vue-router";
const router = useRouter();
const route = useRoute();
const obj = ref([]);
onMounted(() => {
  request
    .get("/detail", {
      params: { id: route.params.id },
    })
    .then((res) => {
      if (res.data.code == 200) {
        obj.value = res.data.data;
      }
    });
});
const addCart=()=>{
    if(localStorage.getItem('token')){

    }
    else{
        router.push('/login');
    }
}
</script>